<template>
	<view class="serve-record full box relative bg-primary flex-col">
		<view class="tab-wrap">
			<u-tabs active-color="#3361F0" :bar-height="6" :bold="false" :list="tabList" :is-scroll="false"
				v-model="currentTab" @change="handleTabChange" :bar-style="{bottom:'-4px'}" />
		</view>
		<view class="w-wrap">
			<view class="w-inner">
				<mescroll-uni @init="mescrollInit" :fixed="false" @down="downCallback" @up="upCallback">
					<view class="record-list">

					</view>
				</mescroll-uni>
			</view>
		</view>
	</view>
</template>

<script>
	import { request } from "@/utils/tool";
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	console.log('server');
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				currentTab: 0,
				list: [],
				tabList: [{
						name: '待付款',
					},
					{
						name: '待服务',
					}, {
						name: '服务中'
					}, {
						name: '已完成'
					},
					{
						name: '已取消'
					}
				]
			}
		},
		methods: {
			handleTabChange(ev) {
				this.currentTab = ev
			},
			async upCallback(ev) {
				const { num, size } = ev
				const { currentTab } = this
				const statusEnum = {
					0: 10,
					1: 20,
					2: 30,
					3: 40,
					4: 50
				}
				const resp = await request({
					url: "/gongdan/lists",
					data: {
						page_no: num,
						page_size: size,
						status: statusEnum[currentTab] || ""
					},
					method: "GET"
				})
				const {} = resp
				console.log(resp, 'resp');

			}
		},
	}
</script>

<style lang="scss" scoped>
	.serve-record {}
</style>